<template>
  <ElTable :data="data" style="width: 100%">
    <ElTableColumn prop="_id" label="id" />
    <ElTableColumn prop="gender" label="name" />
    <ElTableColumn label="edit">
      <template #default="scope">
        <ElButton type="primary" @click="handleEdit(scope.row)">edit</ElButton>
      </template>
    </ElTableColumn>
  </ElTable>
</template>

<script setup>
defineProps({
  data: {
    type: Array,
    required: true
  }
})

const emit = defineEmits(['edit'])
const handleEdit = (row) => {
  emit('edit', row)
}
</script>
